<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>课程介绍</title>
</head>
<body>
    <div class="app-course">
        <!-- 视频部分 -->
        <i class="iconfont icon-return" id="returnIcon"></i>
        <div class="video-intr">
            <video id="courseVideo" src="../imgs/part1.mp4"></video>
            <div class="player dpflex fdcolumn">
                <i id="playIcon" class="iconfont icon-player"></i>
                <span>视频预览</span>
            </div>
        </div>

        <!-- 文字介绍部分 -->
        <div class="text-intr dpflex fdcolumn">
            <!-- 第一部分 -->
            <div class="flex1 first">
                <h3 id="name">巧克力腹肌雕刻</h3>
                <div class="dpflex time">
                    <p><span id="calorie">45</span>千卡</p>
                    <p class="minutes"><span id="time">15</span>分钟</p>

                    <span>
                        <span id="peoplenum">99.99</span>w人练过
                        <i class="iconfont icon-rightreturn"></i>
                    </span>
                </div>
            </div>
            <!-- 第二部分 -->
            <div class="second dpflex">
                <div class="head">
                    <img id="imgurl" src="../imgs/user-img.jpg" alt="">
                </div>
                <div class="second-text dpflex fdcolumn">
                    <h4>用户名</h4>
                    <span>三线达人课程设计师</span>
                </div>
                <a href="#">+ 关注</a>
                <p id="desc">15分钟带你雕刻出性感的巧克力级腹肌, 对腹部进行全方位的刺激, 泵感十足! 型男必备! </p>
            </div>
            <!-- 第三部分 -->
            <div class="flex1 third dpflex">
                <div class="frequency">
                    <i class="iconfont icon-xiongzhang"></i>
                    <span>练习频次</span>
                    <p>每周<span id="frequency">3-5</span>次</p>
                </div>
                <div class="apparatus">
                    <i class="iconfont icon-sports"></i>
                    <span>器械</span>
                    <p id="instrument">无</p>
                </div>
            </div>
            <!-- 第四部分 -->
            <button class="flex1 fourth" id="changeBtn">开始训练</button>
        </div>
    </div>
</body>
</html>